@import url("common.css");
@import url("icons.css");

#content .blocks {
	display: none;
}
#content .block {
	margin: .5em 0;
}
#content .block.hover {
	border-radius: 6px;
	background: -webkit-linear-gradient(top, #fff 0%,#e3f1fa 10%,#d7ebf9 90%,#fff 100%);
}

#content .group {
	padding-bottom: .2em;
	border-bottom: dotted 1px #ccc;
}
#content .group .name {
	float: left;
	width: 290px;
	height: 16px;
	overflow: hidden;
	font-weight: bold;
}
#content .group .ctrl {
	float: right;
	width: 100px;
}
#content .group .ctrl .collapse,
#content .group .ctrl .expand {
	opacity: 1;
}

#content .line {
	height: 16px;
	padding-left: .7em;
	overflow: hidden;
}
#content .line:hover {
	background: -webkit-linear-gradient(top, #62bbe8 0%, #62bbe8 49%,#3baae3 50%,#6bbfea 100%);
	border-radius: 6px;
	color: #fff;
}
#content .line .ip {
	float: left;
	width: 135px;
}
#content .line .domain {
	float: left;
	width: 205px;
}
#content .line .comment {
	opacity: .3;
	font-style: italic;
}
#content .line:hover .comment {
	opacity: 1;
}
#content .line .ctrl {
	float: right;
	width: 40px;
}

#content .group .fade {
	-webkit-transition: opacity .4s;
}
#content .group .fade,
#content .line .fade {
	opacity: .1;
}
#content .hover .group .fade,
#content .line:hover .fade {
	opacity: 1;
}
